/*
 * @Description: 补录按钮
 * @Author: Rfan
 * @Date: 2022-09-28 14:20:43
 * @LastEditTime: 2022-09-28 14:28:58
 */

import { useEffect, useMemo, useState } from 'react';
import { Button } from 'antd';
import type { FC } from 'react';
import Separate from '@/components/LevelTable/componentes/dialogs/Separate';
import AdditionalRecord from '@/components/LevelTable/componentes/dialogs/AdditionalRecord';
import { ICoordinate } from '@/interfaces/global';
import { useLevelTableContext } from '@/components/LevelTable/contexts/LevelTableContext';
import { selectItemByKey } from '@/utils/list';

interface IAdditionalRecordBtnProps {
  data: any;
  coordinate: ICoordinate;
  onSave: any;
}

const AdditionalRecordBtn: FC<IAdditionalRecordBtnProps> = (props) => {
  const { coordinate, data, onSave } = props;
  const { selectItems } = useLevelTableContext();

  // 弹窗展示状态
  const [visible, setVisible] = useState(false);

  const onClose = (data: any) => {
    onSave(data);
    setVisible(false);
  };

  return (
    <>
      <Button
        disabled={selectItems.length !== 1}
        onClick={() => {
          setVisible(true);
        }}
      >
        补录
      </Button>
      {useMemo(
        () => (
          <AdditionalRecord
            visible={visible}
            data={data}
            onClose={onClose}
            coordinate={coordinate}
          />
        ),
        [visible]
      )}
    </>
  );
};

export default AdditionalRecordBtn;
